import React, {Component} from 'react';
import {connect} from 'react-redux'
import Avatar from "@/components/avatar";
import Tabbar from "@/components/tabbar";

import './index.scss';

class My extends Component {
  render() {
    const {userInfo} = this.props;
    return (
      <section className="my-container">
        <div className='white-space my-header-wrap'>
          {/*头像*/}
          <Avatar className='my-avatar' size="big" avatar={userInfo.avatar}/>

          {/*个人信息*/}
          <div className='my-info-wrap'>
            <p className='my-name'>{userInfo.username}</p>
            <p className='my-sign'>签名</p>
          </div>
          {/*<div className='my-qr-img'></div>*/}
        </div>

        <div className="white-space discover-wrap">
          <p className="discover-item">设置</p>
        </div>

        <Tabbar />
      </section>
    )
  }
}

const mapStateToProps = state => {
  return {
    userInfo: state.userInfo
  }
}
export default connect(mapStateToProps)(My)
